<%@ Page Language="C#" MasterPageFile="~/MasterPageMenu.master" AutoEventWireup="true"
    CodeFile="home.aspx.cs" Inherits="Home" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">

    <script src="<%=Request.ApplicationPath%>/UtilWeb/dashboard/CSS/jquery-1.4.2.min.js"
        type="text/javascript"></script>

    <link type="text/css" rel="stylesheet" href="<%=Request.ApplicationPath + "/UtilWeb/dashboard/CSS/custom-theme/jquery-ui-1.8.4.custom.css" %>" />
    <link type="text/css" rel="stylesheet" href="<%=Request.ApplicationPath + "/UtilWeb/dashboard/CSS/Portlets.css" %>" />
    <link rel="stylesheet" type="text/css" media="screen" href="<%=Request.ApplicationPath + "/UtilWeb/Style/forms.css"  %>" />

    <script src="<%=Request.ApplicationPath%>/UtilWeb/Script/Validacion.js" type="text/javascript"></script>

    <style type="text/css">
 
         
        #tabla_portlets 
        {
            width:98%; 
            border: 0px solid #000 !important;
            margin:0 auto;            
            padding:0;
        }
        
        #tabla_portlets td
        {
            border: 0px solid #000 !important;
            margin:0;
            padding:0;
        }
        

        
        .tabla_SinS
        {
          border: 0px solid #000 !important;
        }
    
        
       .column {  padding-bottom: 0px; width:100%;}
       
       .portlet 
       {
           width:100% !important;
           margin: 0;
           z-index:5;
           top: 0;
       }
       
 
       
       embed {
            z-index:-50;
        }
        
        .ancho
        {
         width:80% !important; 
        }
 
        .box {
        border-radius: 15px;
        -moz-border-radius: 15px;
        -webkit-border-radius: 15px; 
        background-color:#d4e6fc !important;
        }
    
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<div class="container_12 clearfix">
		<div class="graybox margin_bottom_box">
		    <div class="graybox_top">
			    <div class="graybox_bottom clearfix">
				    <div class="gray_bg">
					    <h3 class="title_user">
					    <strong> <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_HOME_ASPX_BIENVENIDO) %> </strong>(<asp:Label ID="lblUsuario" runat="server" Text="Label"></asp:Label>)
					    </h3>
					    <div class="featured_middle">
						    <div class="featured_top">
							    <div class="featured_bottom">
								    <p class="clearfix"><span><%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_HOME_ASPX_MENSAJE) %></span><a  href="#"><img  src="Images/bg/cerrar.gif" class="close_box"/></a></p>
							    </div>
						    </div>
					    </div>
				    </div>
			    </div>
		    </div>
		</div>		
	</div>
	 <div class="container_12 clearfix">
     <table id="tabla_portlets" >
     <%--width="36%"--%>
         <tr>
              <td id="pie" style="vertical-align:top;width:36%; height: 59px;" > <%--width="400px"--%>
               <div id="GR_PIE" class="column droppableBox" >  <%--style="width:400px"--%>
                  <div id="portlet2" class="portlet browserDragItem swappable">
                      <div id="PorPie" class="portlet-header">
                          <b> <label id="idTitulo"> </label></b><br />                                                                          
                      </div>
                                     
                      <div id="GraficoPie" class="box" style="background-color:#d4e6fc; height:50px; width:400px">
                       <br />
                       <table id="Table1" width="100%"><tr><td align="center">
                        <asp:DropDownList ID="SelectGraficoPie" runat="server"  CssClass="idleSelect" />
                        <input type="button" class="btn_buscar"  onclick="graficoIndiCircular()" value="<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_OBTENER)%>" />
                       </table>
                      </div>                                    
                                     
                      <div class="portlet-content" style="height:230px;">    
                          <asp:Image ID="GaugeC"  name="GaugeSC" runat="server"  /><br />
                          <b> <label id="TitRea"> </label></b><br />                          
                      </div>
                  </div>
               </div>
            </td>
            
            <td id="barra" style="vertical-align:top; width:40%; height: 59px;">
               <div id="GR_BARRA" class="column newBrowserCol droppableBox">  
                  <div id="portlet3"  class="portlet browserDragItem swappable">
                      <div id="PorBar" class="portlet-header">
                        <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_ACTIVIDADES_USER)   %>                                                                    
                      </div>
                   <%--  <div id="GraficoBar" class="box" style="background-color:#d4e6fc; height:60px;">
                       <br />
                       <table id="Table2" width="100%"><tr><td align="center">
                        <asp:DropDownList ID="SelectGraficoBar" runat="server"  CssClass="idleSelect" />
                        <input type="button" class="btn_medium"  onclick="graficoBars( );" value="<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_OBTENER)%>" />
                       </table>
                      </div>--%>
                         
                         
                      <div class="portlet-content">
                        <div id="chartBar3d">
                        </div>
                      </div>
                  </div>
               </div>
            </td>
            
           <td style="width:24%;">
          
            <div  >
              <div id="idMenu" class="portlet browserDragItem swappable" style="width:311px;">
               <div id="MenuGrafic" class="portlet-header"></div> 
                <div class="portlet-content">
			   <div id="Fechas" class="list_reset clearfix" style="text-align: center">	 					  
					<div class="list_links_box_middle">
					   <div class="list_links_box_top"> 
					      <div class="list_links_box_bottom_1">	 
						      <ul class="list_reset list_links">							 
							      <li style="height:230px;">	
							        <br /><br /><br />
							        <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_DESDE)%>&nbsp;<br />								     
							        <asp:TextBox CssClass="text date-pick required" onkeypress="javascript:fc_Slash(this.id, '/');" onblur="javascript:fc_ValidaFechaOnblur(this.id);" ID="fecha_Inicio" runat="server" MaxLength="10" Width="80" ></asp:TextBox><br /><br />
                                    <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_HASTA)%> &nbsp;<br />
                                    <asp:TextBox CssClass="text date-pick required" onkeypress="javascript:fc_Slash(this.id, '/');" onblur="javascript:fc_ValidaFechaOnblur(this.id);" ID="fecha_Fin"    runat="server" MaxLength="10" Width="80" ></asp:TextBox><br /><br />
                                    &nbsp;&nbsp;<br />                                    
                                    <input id="btn_Obtener" class="btn_buscar" onclick="ObtenerGraficos();" value="<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_OBTENER)%>"  type="button" />
							      </li>
							  </ul>
						  </div> 
					   </div> 
					</div>   
			   </div>
			   </div>
			  </div> 
			</div>
            
            
            </td>
            
            
		</tr>
	</table>	 
	</div>

    <br />
    <br />
    <div class="container_12">
        <div class="clear">
            &nbsp;
        </div>
        <div class="grid_12 omega">
            <div id="list_links" class="clearfix">
                <div class="list_links_box no_margin">
                    <h3 class="clearfix">
                        <strong>&nbsp;&nbsp;&nbsp;&nbsp;
                            <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_UTILITARIOS) %>
                        </strong>
                    </h3>
                    <div class="list_links_box_middle">
                        <div class="list_links_box_top">
                            <div class="list_links_box_bottom">
                                <ul class="list_reset list_links">
                                    <li><a target="_blank" href="<%=ManagerConfiguration.getRuta("T") %>" title="<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_MANUALTECNICO) %>">
                                        <span>
                                            <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_MANUALTECNICO) %>
                                        </span></a></li>
                                    <li><a target="_blank" href="<%=ManagerConfiguration.getRuta("G") %>" title="<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_GENERADOR) %>">
                                        <span>
                                            <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_GENERADOR) %>
                                        </span></a></li>
    <%--                                <li><a target="_blank" href="<%=ManagerConfiguration.getRuta("P") %>" title="<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_MANUALPROCEDIMIENTOS) %>">
                                        <span>
                                            <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_MANUALPROCEDIMIENTOS) %>
                                        </span></a></li>
                                    <li><a target="_blank" href="<%=ManagerConfiguration.getRuta("M") %>" title="<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_MIDDLEWARE) %>">
                                        <span>
                                            <%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_MIDDLEWARE) %>
                                        </span></a></li>--%>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="<%=Request.ApplicationPath%>/UtilWeb/dashboard/CSS/jquery-ui-1.8.2.custom.min.js"
        type="text/javascript"></script>

    <script src="<%=Request.ApplicationPath%>/UtilWeb/dashboard/CSS/timer/jquery.timers.js"
        type="text/javascript"></script>

    <script src="<%=Request.ApplicationPath%>/UtilWeb/dashboard/CSS/fusioncharts/FusionCharts.js"
        type="text/javascript"></script>

    <script type="text/javascript" src="<%=Request.ApplicationPath%>/UtilWeb/Script/JSGraficIndicadores.js"></script>

    <script type="text/javascript" src="<%=Request.ApplicationPath%>/UtilWeb/Script/DD_roundies.js"></script>

    <script type="text/javascript"> 
            
            <asp:Literal ID="ltrUsuario" runat="server" /> 
            
            function ObtenerGraficos()
            {
              $('#PorPie .ui-icon-minusthick').hide();
              $('#PorBar .ui-icon-minusthick').hide();
              
              $('#idMenu .ui-icon-circle-triangle-s').hide();
              $('#GR_BARRA .ui-icon-circle-triangle-s').hide();
              
         
              
             var param  = 'fechaInicio=' + $("#ctl00_ContentPlaceHolder1_fecha_Inicio").get(0).value;
                 param += '&fechaFin=' + $("#ctl00_ContentPlaceHolder1_fecha_Fin").get(0).value;
                 param += '&Usuario=' + Usuario;  
                
               graficoIndiCircular(); 
               dibujarBarras(param);
               
               $("embed").attr("wmode", "transparent");
               
            }
            
            function graficoIndiCircular()
            {    
            var parametro  = 'Graf='+ $('#ctl00_ContentPlaceHolder1_SelectGraficoPie').val(); //CIRCULO
                parametro += '&fechainicio=' + $('#ctl00_ContentPlaceHolder1_fecha_Inicio').get(0).value;
                parametro += '&fechafin=' + $('#ctl00_ContentPlaceHolder1_fecha_Fin').get(0).value;                
                parametro += '&Usuario=' + Usuario;                   
              
                enviarGrafica('<%=Request.ApplicationPath%>/UtilWeb/dashboard/GIndicadores/GraficosIndicadores.ashx', parametro);     
            
            }
            
            
            function fnDibujarGrafico(Val, ActReal, ActProg, Titulo, LabFoot)            
            { 
              var ValueReal = LabFoot +" = " + ActReal + " - " + '<%= IdiomaCultura.getMensajeEncodeHTML(IdiomaCultura.WEB_PROGRAMADAS)   %> '+"= " + ActProg;
            
              $('#ctl00_ContentPlaceHolder1_GaugeC').attr('src',"<%=Request.ApplicationPath%>/Indicadores/Gauge1.aspx?Value=" + Val + "&Limite1=20&Limite2=80");
              $('#idTitulo').text(Titulo);              
              $('#TitRea').text(ValueReal);
              
              
            }
            
            
            function dibujarPie(parametros)
            {
             
             var anchoGrafico2 = 420;
             
             var direccionGrafico = "<%=Request.ApplicationPath%>/UtilWeb/dashboard/Charts/" + "FCF_Pie3D.swf"
	         var pie3d = new FusionCharts(direccionGrafico, "pie3d", anchoGrafico2, "230");
	         pie3d.setDataURL(escape("<%=Request.ApplicationPath%>/UtilWeb/dashboard/portlets/Portlet2.ashx?"+parametros));		   
	         pie3d.render("chartPie3d");
 
            }
            
            function dibujarBarras(parametros)
            {
 
            var anchoGrafico3 = 300;//380
            
            var direccionGrafico = "<%=Request.ApplicationPath%>/UtilWeb/dashboard/Charts/" + "FCF_Column3D.swf";
            var bar3d = new FusionCharts(direccionGrafico, "bar3d", anchoGrafico3, "230");
            bar3d.setDataURL(escape("<%=Request.ApplicationPath%>/UtilWeb/dashboard/portlets/Portlet3.ashx?"+parametros));		   
            bar3d.render("chartBar3d");
            
            }
            
            
            
            
            
            function iconoLista()
            {
                 $('#PorPie .ui-icon-circle-triangle-s').live('click', function() {$(this).toggleClass("ui-icon-circle-triangle-s").toggleClass("ui-icon-circle-triangle-n");$('#GraficoPie').show(); });
                 $('#PorPie .ui-icon-circle-triangle-n').live('click', function() {$(this).toggleClass("ui-icon-circle-triangle-n").toggleClass("ui-icon-circle-triangle-s");$('#GraficoPie').hide(); });
            
            }
            function iconoDefecto()
            {
             $('#GraficoPie').hide();
            }
            
           
            $(function() {	
        
                Icono(false);
                         
                 options = {
                     opacity: 0.5,
                     revert: true,
                     zIndex: 5,  
                      top:   0,                            
 			         cursor: "move",
 			         tolerance: "point"
     			    
                }
                
               // $('div.browserDragItem').draggable(options);            
                $('div.droppableBox').droppable({            
                    
                    drop: function(event, ui) {	 
                         var oldDrag = $(this).find('div.swappable');                                          
                         var newDrag =  ui.draggable;
                         var newParent = newDrag.parent();                      
                         var portlet =  newDrag.get(0).id;                              
                         var oldParent = oldDrag.parent();
                         
                         
                        if(oldDrag.get(0) != newDrag.get(0))
                         { 
                                        
                             $(this).append(newDrag).end();                                                                     
                             newParent.append(oldDrag).end();
                             oldDrag.draggable(options); 
                       
                  
                         }
      
                   }
                    
                });
                
                
                function Icono(bool){
                var uiconos = bool ? '.portlet-header .ui-icon-minusthick':'.portlet-header .ui-icon-plusthick';
                
                    $(uiconos).live('click', function() {                                      
                       $(this).toggleClass("ui-icon-minusthick").toggleClass("ui-icon-plusthick");			        			       			       
                       $('#PorPie').parents(".portlet:first").find(".portlet-content").toggle();
                       $('#PorBar').parents(".portlet:first").find(".portlet-content").toggle();
			           $(this).parents(".portlet:first").find(".portlet-content").toggle();
        			   
                     });

                }
               
               function estilosPortlets()
               {    
                    Icono(true);                   
                    var estiloicono = '<span class="ui-icon ui-icon-minusthick"></span>';
                    var ico =  '<span id="iconoAbrir" class="ui-icon ui-icon-circle-triangle-s"></span>';
            
         
                    $(".portlet").addClass("ui-widget ui-widget-content ui-helper-clearfix ui-corner-all")
                        .find(".portlet-header")            
	                    .addClass("ui-widget-header ui-corner-all") 	                		    	        
	                    .prepend(ico)	
	                    .prepend(estiloicono)	           	            	                              				    
	                    .end()
                    .find(".portlet-content"); 
               
               }
    
                
                estilosPortlets();
                ObtenerGraficos();
                iconoDefecto()
                iconoLista();
 
        });
        
        
        $(function() {
		    $( "#ctl00_ContentPlaceHolder1_fecha_Inicio" ).datepicker({ 
			    dateFormat: 'dd/mm/yy',
			    closeText: 'X',			
		        showButtonPanel: true,
                showOtherMonths: true
 
		    });     
	    });		
 	  
	    $(function() {
		    $( "#ctl00_ContentPlaceHolder1_fecha_Fin" ).datepicker({ 
			    dateFormat: 'dd/mm/yy', 
		        closeText: 'X',			
		        showButtonPanel: true,
                showOtherMonths: true
		    });
	    });	

      
    </script>

</asp:Content>
